// React组件封装
// 定义规则:
// 1:符合js函数的定义(函数定义,函数表达式,剪头函数)
// 2:函数名称必须以大写字母开头,这样渲染的时候可以识别出这是个组件标签,小写识别对应html标签
// 3:函数组件必须有返回值,表示该组件的UI结构.如果不需要渲染任何结构,则返回null


// 二:======================>
// 代码实现
// // 函数定义组件
// function Hello(){
//   return <div> 我是函数定义的组件</div>
// }
// // 函数表达式组件

// const Button=function(){
//   return <button>我是函数表达式组件</button>}
//   // 剪头函数组件
//   const Hi=()=>{
//     return <div>我是剪头函数组件</div>
//   }



  // 三:=====================
  // 使用规则
  // a :使用函数名称作为组件标签的名字
  // b :交给ReactDOM.render()来渲染即可

  // ReactDom.render(<Hello></Hello>,document.getElementById('root'))//双标签
  // ReactDOM.render(<Hello/>,document.getElementById('root'))//自闭合标签